﻿// JavaScript Document
//性别选择
$(document).ready(function () {
    if ($(".sex_inp").val() == 1) {
        $(".sex_1").addClass("on");
        $(".sex_2").removeClass("on");
    } else if ($(".sex_inp").val() == 2) {
        $(".sex_2").addClass("on");
        $(".sex_1").removeClass("on");
    }
})
function SexSelect1() {
    $(".sex_1").addClass("on");
    $(".sex_2").removeClass("on");
    $(".sex_inp").val(1);
}
function SexSelect2() {
    $(".sex_2").addClass("on");
    $(".sex_1").removeClass("on");
    $(".sex_inp").val(2);
}

//创建下拉框方法,传入需要改变外款的下拉框选择区,如果不传则处理所有下拉框
function CreateSelect(selector) {

    var ele = $(selector || "select"); //如果selector参数为空,则获取页面上所有的select
    if (ele.length > 1) {//如果待处理元素超过1个,则循环处理
        for (var i = 0; i < ele.length; i++) {
            CreateSelect(ele[i]); //取出一个独立的元素递归
        }
        return;
    }
    if (!ele.is("select")) { //如果元素不是select 不处理
        return;
    }

    var dd = ele.data("link_dropdown"); //取出特定数据中的jquery对象(以下称为dd)
    if (dd) dd.remove();				//如果存在,则 dd 从页面中删除
    dd = $('<div class="btn-group">');	//创建 新的dd
    ele.data("link_dropdown", dd);		//将 dd 存入select.data("link_dropdown"),以便下次创建时删除

    //按bootstarp规则创建下拉框元素
    var btn = $('<div class="selwarp dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"></div>');
    btn.text(ele.find(":selected").text()); //显示被选中的元素的text,并加入'三角形'元素
    btn.width(ele.width());		//将宽度设置和原先的select元素相同
    dd.append(btn);				//添加到dd中
    var ul = $('<ul class="dropdown-menu">');
    dd.append(ul);

    var ops = ele.find("option");//获取select中所有的option元素
    for (var i = 0; i < ops.length; i++) {
        var a = $("<a href='javascript:void(0)'>" + $(ops[i]).text() + "</a>"); //设置可点击的a标签

        a.on("click", null, $(ops[i]), function (e) { //设置li元素的click事件,并将对应的option传入事件的e.data中(第三个参数)
            var me = $(this);
            me.parents("ul").prev().text(me.text()); //设置btn的text值为点击的li的text
            e.data.prop("selected", true); //将对应的option selected属性设置为true
        })
        ul.append($("<li>").append(a));
    }
    ele.hide(); 		//隐藏原有的select元素
    ele.after(dd);		//将dd插入到select元素后面
    if (!ele.data("bind_change_event")) { //判断select元素是否已经绑定了change事件
        ele.on("change", function (e) {
            var dd = $(this).data("link_dropdown"); //获取select对应的dd
            if (dd) { //判断dd是否已经被删除
                var index = $(this).find(":selected").index($(this));//得到select中选中的option的索引
                dd.find("a").eq(index).click(); //在dd中选中和option相同索引的a标签,并触发click事件
            }
        });
        ele.data("bind_change_event", true); //将绑定change标识设置为true
    }
}

//CreateSelect(); 模拟下拉框
